<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0"><meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />   
        <title>Welcome to Design Zone......</title>
        <link rel="stylesheet" type="text/css" href="../../scripts/ext/resources/css/ext-all.css" />
        <link rel="stylesheet" type="text/css" href="../../styles/dzbase.css" />
        <script type="text/javascript" src="../../scripts/ext/adapter/ext-base.js">
        </script>
        <script type="text/javascript" src="../../scripts/ext/ext-all.js">
        </script>
		<script type="text/javascript" src="../../scripts/grid/GroupSummary.js">
        </script>
		<script type="text/javascript" src="../../scripts/menu/EditableItem.js"></script>
		<script type="text/javascript" src="../../scripts/menu/RangeMenu.js"></script>
		<script type="text/javascript" src="../../scripts/grid/GridFilters.js"></script>
		<script type="text/javascript" src="../../scripts/grid/filter/Filter.js"></script>
		<script type="text/javascript" src="../../scripts/grid/filter/StringFilter.js"></script>
		<script type="text/javascript" src="../../scripts/grid/filter/ListFilter.js">
        </script>
		<script type="text/javascript" src="../../scripts/grid/RowExpander.js">
        </script>
        <script type="text/javascript" src="../../scripts/i18nMessage.js">
        </script>
        <script type="text/javascript" src="../../scripts/utils.js">
        </script>
		<script type="text/javascript" src="../../scripts/imageViewer.js"></script>
        <script type="text/javascript">
        	var stockMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.stock');
        	var dzColorMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.dzcolor');
            var pantoneMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.pantonecolor');
			var yarnMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.yarn');
			var customerMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.francecustomer');
			var fcMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.factory');
			var customerMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.francecustomer');
            var message = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=message');
			
			var customerXmlLoader = new i18nMessage('../../servlet/BiFranceCustomerServlet?action=5');
			var ctYarnMaterialXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtYarnMaterial');
			var ctDyeingXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtDyeing');
			var ctFilsTypeXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtFilsType');
			var ctColorFamilyXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtColorFamily');
			var ctColorTypeXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtColorType');
			var ctSeasonNumberXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtSeasonNumber');
			var ctSendByXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtSendBy');
            var ctYesnoXmlLoader = new i18nMessage('../../servlet/CodeTableServlet?name=CtYesno');
			
        	var store;
            var grid;
			
            var deleteCallback = function(btn){
                if (btn == 'yes') {
                    Ext.Ajax.request({
                        url: '../../servlet/BiDZColorServlet?action=2&id=' + deleteId,
                        success: function(o){
                            if (o.responseText == 'success') {
                                store.reload();
                                messageTip.msg(message.get('message.tip'), message.get('message.delete.successful'));
                            }
                            else {
                                messageTip.msg(message.get('message.tip'), message.get('message.delete.unsuccessful'));
                            }
                        },
                        failure: function(o){
                            messageTip.msg(message.get('message.tip'), message.get('message.delete.failure'));
                        },
                        params: {
                            foo: 'bar'
                        }
                    });
                }
            }
			
			 Ext.onReady(function(){
                // create the Data Store
                
                
                store = new Ext.data.GroupingStore({
                    url: '../../servlet/StockServlet?action=10',
                    
                    reader: new Ext.data.XmlReader({
                        record: 'item',
                        id: 'id',
                        totalRecords: 'itemTotal'
                    }, [ 
                    'id', 'index', 'dzColorCode', 'pantoneNumber','realColor', 'factoryName',
                    {name: 'inStock', type: 'float'},{name: 'onTheWayStock', type: 'float'},
                    {name: 'bookedStock', type: 'float'},{name: 'outStock', type: 'float'},{name:'stock', type: 'float'},
					{name: 'biYarn.ctYarnMaterial1', mapping: 'ctYarnMaterial1'},
					{name: 'biYarn.ctYarnMaterial2', mapping: 'ctYarnMaterial2'},
					{name: 'biYarn.ctYarnMaterial3', mapping: 'ctYarnMaterial3'},
					{name: 'biYarn.ctYarnMaterial4', mapping: 'ctYarnMaterial4'},
					{name: 'biYarn.ctYarnMaterial5', mapping: 'ctYarnMaterial5'},
					{name: 'biFranceCustomer.name', mapping: 'customerName'}, 
					{name: 'biFranceCustomer.department', mapping: 'customerDepartment'}, 'customerColorCode',
					'supplierNumber','isApprovied1', 'isApprovied2', 'ctSeasonNumber', 'photo1Name', 'photo2Name','photo3Name', 'comment', 'isApproved']),

					groupField: 'dzColorCode',
                    
                    sortInfo:{
                    	field: 'dzColorCode',
                    	direction: 'asc'
                    },
                    
                    remoteSort: true
                });
				
				var filters = new Ext.grid.GridFilters({
					  filters:[
					    {type: 'string',  dataIndex: 'dzColorCode'},
					    {type: 'string', dataIndex: 'biFranceCustomer.name'},
						{type: 'string', dataIndex: 'biFranceCustomer.department'},
						{type: 'string', dataIndex: 'customerColorCode'},
						{type: 'list',  dataIndex: 'isApprovied1', options: ctYesnoXmlLoader.getCtArray() },
						{type: 'list',  dataIndex: 'isApprovied2', options: ctYesnoXmlLoader.getCtArray() },
						{type: 'list',  dataIndex: 'biYarn.ctYarnMaterial1', options: ctYarnMaterialXmlLoader.getCtArray() },
						{type: 'list',  dataIndex: 'biYarn.ctYarnMaterial2', options: ctYarnMaterialXmlLoader.getCtArray() },
						{type: 'list',  dataIndex: 'biYarn.ctYarnMaterial3', options: ctYarnMaterialXmlLoader.getCtArray() },
						{type: 'list',  dataIndex: 'biYarn.ctYarnMaterial4', options: ctYarnMaterialXmlLoader.getCtArray() },
						{type: 'list',  dataIndex: 'biYarn.ctYarnMaterial5', options: ctYarnMaterialXmlLoader.getCtArray() }
					]});
                
				var expander = new Ext.grid.RowExpander({
			        tpl : new Ext.XTemplate(
						'<p><b>' + pantoneMessage.get('ui.pantonecolor.number') + ':</b>&nbsp;&nbsp; {pantoneNumber}&nbsp;&nbsp;&nbsp;&nbsp;<table width="60" style="background: #{realColor};position: absolute;"><tr height="15"><td>&nbsp;</td></tr></table></p>',
						'<br/><p><b>' + dzColorMessage.get('ui.dzcolor.factorycolorcode') + ':</b>&nbsp;&nbsp; {supplierNumber}&nbsp;&nbsp;&nbsp;&nbsp;<b>' + fcMessage.get('ui.factory.name') + ':</b>&nbsp;&nbsp; {factoryName}</p>',
						'<br/><p><img src="../../_temp/{photo3Name}" width="150px" onclick="openImageViewer(this.src);"/></p><br/>',
						'<br/><br/><p><b>' + message.get('message.edit.comment') + ':</b> {comment}</p><br/>'
			        )
			    });
                // create the grid
                var summary = new Ext.grid.GroupSummary();
                grid = new Ext.grid.GridPanel({
                    title: stockMessage.get('ui.stock.yarnstock'),
                    store: store,
					stripeRows: true,
					plugins: [summary, filters, expander],
                    height: 580,
                    columns: [expander, {
                        header: message.get('message.list.id'),
                        width: 20,
                        dataIndex: 'index',
                        sortable: false
                    }, {
                        header: dzColorMessage.get('ui.dzcolor.code'),
                        width: 80,
                        dataIndex: 'dzColorCode',
                        sortable: true
                    },{
                        header: yarnMessage.get('ui.yarn.material') + '1',
                        dataIndex: 'biYarn.ctYarnMaterial1',
                        sortable: true
                    },{
                        header: yarnMessage.get('ui.yarn.material') + '2',
                        dataIndex: 'biYarn.ctYarnMaterial2',
                        sortable: true
                    },{
                        header: yarnMessage.get('ui.yarn.material') + '3',
                        dataIndex: 'biYarn.ctYarnMaterial3',
                        sortable: true
                    },{
                        header: yarnMessage.get('ui.yarn.material') + '4',
                        dataIndex: 'biYarn.ctYarnMaterial4',
                        sortable: true
                    },{
                        header: yarnMessage.get('ui.yarn.material') + '5',
                        dataIndex: 'biYarn.ctYarnMaterial5',
                        sortable: true
                    },{
                        header: customerMessage.get('ui.francecustomer.name'),
                        dataIndex: 'biFranceCustomer.name',
                        sortable: true
                    },{
                        header: customerMessage.get('ui.francecustomer.department'),
                        dataIndex: 'biFranceCustomer.department',
                        sortable: true
                    },{
                        header: dzColorMessage.get('ui.dzcolor.customercolorcode'),
                        dataIndex: 'customerColorCode',
                        sortable: true
                    },{
                        header: dzColorMessage.get('ui.dzcolor.isapproved'),
                        dataIndex: 'isApproved',
                        sortable: true,
						renderer: renderYesno
                    },{
                        header: dzColorMessage.get('ui.dzcolor.seasonnumber'),
                        dataIndex: 'ctSeasonNumber',
                        sortable: true
                    },{
                        header: stockMessage.get('ui.stock.instock'),
                        dataIndex: 'inStock',
                        sortable: true,
                        align: 'right',
                        renderer: renderStork,
                        summaryType:'sum'
                    },{
                        header: stockMessage.get('ui.stock.onthewaystock'),
                        dataIndex: 'onTheWayStock',
                        sortable: true,
                        align: 'right',
                        renderer: renderStork,
                        summaryType:'sum'
                    },{
                        header: stockMessage.get('ui.stock.bookedstock'),
                        dataIndex: 'bookedStock',
                        sortable: true,
                        align: 'right',
                        renderer: renderStork,
                        summaryType:'sum'
                    },{
                        header: stockMessage.get('ui.stock.outstock'),
                        dataIndex: 'outStock',
                        sortable: true,
                        align: 'right',
                        renderer: renderStork,
                        summaryType:'sum'
                    },{
                        header: message.get('message.edit.stock')+'(Kg)',
                        dataIndex: 'stock',
                        align: 'right',
                        renderer: renderStork,
                        summaryType:'sum'
                    },{
                        header: message.get('message.edit.adjuststock'),
                        dataIndex: 'id',
                        sortable: false,
                        renderer: function(value, p, record){
                    		return String.format('<a href="yarn_stock_inout_edit.html?id={0}&startPage={1}" target="_self"><img src="../../images/icons/lorry.png" title="' + message.get('message.edit.adjuststock') + '" /></a>', record.data.id, Math.floor((record.data.index - 1) / 20) + 1);
                    	}
                    }],
                    view: new Ext.grid.GroupingView({
                        forceFit: true,
						hideGroupedColumn: false,
						enableNoGroups:false,
                        groupTextTpl: '&nbsp;&nbsp;<b>' + dzColorMessage.get('ui.dzcolor.code') + ':</b>&nbsp;&nbsp;{[values.rs[0].data.dzColorCode]}'
                    }),
                    loadMask: true,
                    renderTo: 'biDZColor',
                    bbar: new Ext.PagingToolbar({
                        pageSize: 20,
                        store: store,
                        displayInfo: true
                    })
                });
                
                var startPage = getPrarmeterValue(window.location, 'startPage');
                var start;
                if (startPage == null || startPage == '') {
                    start = 0;
                }
                else {
                    start = (startPage - 1) * 20;
                }
                store.load({
                    params: {
                        start: start,
                        limit: 20
                    }
                });
				
				function renderYesno(value, p, record){
					if(value == '02')
						return String.format('<img ext:qtip="{0}" src="../../images/icons/cross.png" />', record.data.comment3);
					else if(value == '01')
						return String.format('<img ext:qtip="{0}" src="../../images/icons/tick.png"/>', record.data.comment3);
					else
						return '';
                }
                
            });
                 var renderStork = function(value, p, record){
					if(!value){
	               		value = 0.0;
	               	}
	               	return render3D(value);
				}
                    
        </script>
    </head>
    <body>
        <div id="biDZColor">
        </div>
    </body>
</html>
